<template>
    <layout>
      <div class="container">
        <el-breadcrumb separator="/">
        <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item  :to="{ path: '/pages/article/index' }"><a>我的留言</a></el-breadcrumb-item>
        <el-breadcrumb-item><a>留言回复</a></el-breadcrumb-item>
      </el-breadcrumb>
      <el-form :model="form" :rules="rules" ref="form" label-width="100px" class="form">
        <el-form-item label="创建时间" v-if="id" prop="create_time">
          <view>{{ parseTime(detail.create_time) }}</view>
        </el-form-item>
        <!-- <el-form-item label="类别" prop="sort">
          <el-select v-model="form.sort" value-key="" placeholder="请选择类别" clearable filterable @change="">
            <el-option v-for="item in typeList"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </el-form-item> -->
        <el-form-item label="姓名" prop="username">
          <view>{{ detail.username }}</view>
        </el-form-item>
        <el-form-item label="电话" prop="phone">
          <view>{{ detail.phone }}</view>
        </el-form-item>
        <el-form-item label="邮箱" prop="email">
          <view>{{ detail.email }}</view>
        </el-form-item>
        <el-form-item label="内容" prop="content">
          <view>{{ detail.content }}</view>
        </el-form-item>
        <el-form-item label="回复" prop="replay">
          <el-input v-model="form.replay"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="submitForm('form')">确定</el-button>
          <el-button @click="resetForm('form')">重置</el-button>
        </el-form-item>
      </el-form>
      </div>
    </layout>
</template>

<script>
import layout from '@/layout/index.vue'	
export default {
  components: {layout},
    data () {
        return {
          id:'',
          table:'',
          typeList:[
            {label:'心情随笔',value:'note'},
            {label:'韶华追忆',value:'memory'},
            {label:'个人作品',value:'works'},
          ],
          detail:{},
          form:{
            replay:''
            },
            rules: {
              replay: [
                { required: true, message: '请输入回复', trigger: 'blur' },
              ],
            }
        };
    },
    onLoad (options) {
      if(options){
        this.id = options.id
        this.table = options.table
        this.getdDetail()
      }
    },
    methods: {
      // 详情
     getdDetail(){
      const data={
				id:this.id,
				table:this.table,
			}
			console.log(('data',data))
      this.$Ajax('getDetail',data,res=>{
      	console.log(res.data)
      	 this.detail = res.data
      })
    },
      submitForm(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            const data={
							replay:this.form.replay,
						}
						console.log('data',data)
						uni.showLoading({
							title: '提交中',
							mask: true
						});
						this.$Ajax('addUser', data, res => {
							uni.hideLoading();
							if (res.code == 200) {
								this.$tools.toastJump('注册成功','./login')
							} else {
								this.$tools.toast(res.message)
							}
						},err=>{
							uni.hideLoading();
							console.log('err',err)
						})
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      },
      resetForm(formName) {
        this.$refs[formName].resetFields();
      },
    },
};
</script>

<style scoped>
.container{
  max-width: 1000px;
  margin: 20px auto;
}
.form{
	width: 375px;
  max-width: 80%;
  margin: 20px auto;
}
</style>
